<template>
  <view :class="[ns.b, disabled && 'is-disabled', config?.isActive(props) && 'is-active']"
    @click="config?.change(props)">
    <view :class="[ns.e('text')]">
      <slot>{{ label ?? value }}</slot>
    </view>
    <view class="iconfont icon-select"></view>
  </view>
</template>

<script lang="ts" setup>
import { useNamespace } from '@/utils'
import Option from '.'
import { inject } from 'vue'
import Select from '..'

defineOptions({
  name: Option.name
})
const props = defineProps(Option.props)
const ns = useNamespace(Option.name)
const config = inject<Select.ProvideContext>(Select.provideName)
</script>